Skip to content

feat(web): add keyword search to docs hub and FAQ pages#4364

Merged
Hmbown merged 2 commits into
Hmbown:mainfrom
idling11:feat/web-keyword-search
Jul 14, 2026
Merged

feat(web): add keyword search to docs hub and FAQ pages#4364
Hmbown merged 2 commits into
Hmbown:mainfrom
idling11:feat/web-keyword-search

Conversation

@idling11

Copy link
Copy Markdown
Contributor

Add client-side keyword search to two of the most content-heavy pages on codewhale.net:

Docs hub (/docs):

  • New DocsSearch client component with real-time filtering across all doc topics (label, description, source files, category — in both EN and ZH)
  • Search input with / keyboard shortcut to focus, clear button, result count, and no-results state
  • Matched text is highlighted inline
  • The topic grid and category sections update live as you type

FAQ page (/faq):

  • New FaqSearch client component wrapping the existing FAQ item list
  • Full-text matching across question text, answer content (extracted from React nodes), and source citations
  • Same UX patterns: / shortcut, highlight, result count

Shared logic:

  • web/lib/search-utils.ts extracts the pure filtering functions for unit testability
  • web/lib/search-utils.test.ts: 19 tests covering haystack building, locale-cross-matching, case-insensitivity, and edge cases

Styling:

  • .search-input and mark.search-highlight classes in globals.css, using existing CSS variables for consistency with the site theme

Summary

Testing

  • cargo fmt --all -- --check
  • cargo clippy --workspace --all-targets --all-features
  • cargo test --workspace --all-features

Checklist

  • Updated docs or comments as needed
  • Added or updated tests where relevant
  • Verified TUI behavior manually if UI changes
  • Harvested/co-authored credit uses a GitHub numeric noreply address

Add client-side keyword search to two of the most content-heavy pages
on codewhale.net:

Docs hub (/docs):
- New DocsSearch client component with real-time filtering across all
  doc topics (label, description, source files, category — in both EN
  and ZH)
- Search input with / keyboard shortcut to focus, clear button, result
  count, and no-results state
- Matched text is highlighted inline
- The topic grid and category sections update live as you type

FAQ page (/faq):
- New FaqSearch client component wrapping the existing FAQ item list
- Full-text matching across question text, answer content (extracted
  from React nodes), and source citations
- Same UX patterns: / shortcut, highlight, result count

Shared logic:
- web/lib/search-utils.ts extracts the pure filtering functions for
  unit testability
- web/lib/search-utils.test.ts: 19 tests covering haystack building,
  locale-cross-matching, case-insensitivity, and edge cases

Styling:
- .search-input and mark.search-highlight classes in globals.css,
  using existing CSS variables for consistency with the site theme
@idling11 idling11 requested a review from Hmbown as a code owner July 14, 2026 03:16
@Hmbown Hmbown merged commit c220abd into Hmbown:main Jul 14, 2026
16 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants